<template>
    <Card :bordered="false" :dis-hover="true">
        <p slot="title" style="height: 40px">
            <Tag type="dot" color="red">历史未完成：{{pageModel.totalSize}}</Tag>
        </p>
        <Tabs :value="selectPane" @on-click="clickTabs">
            <TabPane label="电话随访" name="1">
                <Card :bordered="false" :dis-hover="true">
                    <p v-if="datas.length === 0" align="center">
                        <img width="20%" src="@/images/noData.png"></img>
                    </p>
                    <Form ref="formInline" :label-width="100">
                        <Row type="flex" :gutter="8">
                            <Col v-for="(item,index) in datas" :key="index" v-if="item.process === 1" span="12">
                                <Card style="width:100%;margin-top: 5px">
                                    <p style="font-size: 18px" slot="title">
                                        <Row>
                                            <Col span="12">
                                                <label>{{item.patientName}} - {{item.medicalNumber}}</label>
                                            </Col>
                                        </Row>
                                    </p>
                                    <a v-if="item.status === 0" href="#" slot="extra">
                                        <Tag color="#5cadff">{{item.status | statusFilter}}</Tag>
                                    </a>
                                    <a v-if="item.status === 1" href="#" slot="extra">
                                        <Tag color="#2d8cf0">{{item.status | statusFilter}}</Tag>
                                    </a>
                                    <a v-if="item.status === 2" href="#" slot="extra">
                                        <Tag color="#ff9900">{{item.status | statusFilter}}</Tag>
                                    </a>
                                    <a v-if="item.status === 3" href="#" slot="extra">
                                        <Tag color="#ed3f14">{{item.status | statusFilter}}</Tag>
                                    </a>
                                    <!--<Tabs ref="tabs">-->
                                    <!--<TabPane name="1" label="预约详情" icon="clipboard">-->
                                    <Row>
                                        <Col span="6" align="center">
                                            <p>预约类型：</p>
                                        </Col>
                                        <Col span="6">
                                            <p v-if="item.type === 1"><Tag color="#ff9900">{{item.type | typeFilter}}</Tag></p>
                                            <p v-if="item.type === 2"><Tag color="#19be6b">{{item.type | typeFilter}}</Tag></p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>预约时间：</p>
                                        </Col>
                                        <Col span="6">
                                            <p>{{item.appointment | dateTimeFormatter}}</p>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span="6" align="center">
                                            <p>预约医生：</p>
                                        </Col>
                                        <Col span="6">
                                            <p>{{item.doctorName}}</p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>预约护士：</p>
                                        </Col>
                                        <Col span="6">
                                            <p>{{item.nurseName}}</p>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <!--<Col span="6" align="center">-->
                                            <!--<p>提醒方式：</p>-->
                                        <!--</Col>-->
                                        <!--<Col span="6">-->
                                            <!--<p style="text-align: left">{{item.remind | remindFilter}}</p>-->
                                        <!--</Col>-->
                                        <Col span="6" align="center">
                                            <p>预约专家：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left">{{item.expertName | valueFilter}}</p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>处理方式：</p>
                                        </Col>
                                        <Col span="6">
                                            <p v-if="item.process === 1" style="text-align: left"><Tag color="blue">{{item.process | processFilter}}</Tag></p>
                                            <p v-if="item.process === 2" style="text-align: left"><Tag color="#ed3f14">{{item.process | processFilter}}</Tag></p>
                                        </Col>
                                    </Row>
                                    <Row style="margin-top: 5px">
                                        <Col span="6" align="center">
                                            <p>主管医生：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left">{{item.competentDoctor | valueFilter}}</p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>主管护士：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left">{{item.competentNurse | valueFilter}}</p>
                                        </Col>
                                    </Row>
                                    <Row style="margin-top: 5px">
                                        <Col span="6" align="center">
                                            <p>主管客服：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left">{{item.customerName | valueFilter}}</p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>联系方式：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left"><Tag type="border" color="green">{{item.phone | valueFilter}}</Tag></p>
                                        </Col>
                                    </Row>
                                    <Row style="margin-top: 5px">
                                        <Col span="6" align="center">
                                            <p>预约备注：</p>
                                        </Col>
                                        <Col span="18">
                                            <p style="height: 50px">{{item.note | noteFilter}}</p>
                                        </Col>
                                    </Row>
                                    <!--</TabPane>-->
                                    <!--</Tabs>-->
                                    <p style="margin-top: 10px" align="right">
                                        <ButtonGroup shape="circle">
                                            <Button type="ghost" v-for="(button,index) in buttons1" v-if="button.parentId === menuId1" :key="index" :icon="button.icon" @click="events(button, item)">
                                                {{button.title}}
                                            </Button>
                                        </ButtonGroup>
                                    </p>
                                </Card>
                            </Col>
                        </Row>
                    </Form>
                </Card>
                <Card :bordered="false" :dis-hover="true">
                    <p slot="title">&nbsp;</p>
                    <iview-page
                            :totalSize="pageModel.totalSize"
                            :pageNumber="pageModel.pageNumber"
                            :pageSize="pageModel.pageSize"
                            :pageSizeOpts="pageModel.pageSizeOpts"
                            v-on="{changePageNumber:changePageNumber,changePageSize:changePageSize}">
                    </iview-page>
                </Card>
            </TabPane>
            <TabPane label="预约到店" name="2">
                <Card :bordered="false" :dis-hover="true">
                    <p v-if="datas.length === 0" align="center">
                        <img width="20%" src="@/images/noData.png"></img>
                    </p>
                    <Form ref="formInline" :label-width="100">
                        <Row type="flex" :gutter="8">
                            <Col v-for="(item,index) in datas" :key="index" v-if="item.process === 2" span="12">
                                <Card style="width:100%;margin-top: 5px">
                                    <p style="font-size: 18px" slot="title">
                                        <Row>
                                            <Col span="12">
                                                <label>{{item.patientName}} - {{item.medicalNumber}}</label>
                                            </Col>
                                        </Row>
                                    </p>
                                    <a v-if="item.status === 0" href="#" slot="extra">
                                        <Tag color="#5cadff">{{item.status | statusFilter}}</Tag>
                                    </a>
                                    <a v-if="item.status === 1" href="#" slot="extra">
                                        <Tag color="#2d8cf0">{{item.status | statusFilter}}</Tag>
                                    </a>
                                    <a v-if="item.status === 2" href="#" slot="extra">
                                        <Tag color="#ff9900">{{item.status | statusFilter}}</Tag>
                                    </a>
                                    <a v-if="item.status === 3" href="#" slot="extra">
                                        <Tag color="#ed3f14">{{item.status | statusFilter}}</Tag>
                                    </a>
                                    <!--<Tabs ref="tabs">-->
                                    <!--<TabPane name="1" label="预约详情" icon="clipboard">-->
                                    <Row>
                                        <Col span="6" align="center">
                                            <p>预约类型：</p>
                                        </Col>
                                        <Col span="6">
                                            <p v-if="item.type === 1"><Tag color="#ff9900">{{item.type | typeFilter}}</Tag></p>
                                            <p v-if="item.type === 2"><Tag color="#19be6b">{{item.type | typeFilter}}</Tag></p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>预约时间：</p>
                                        </Col>
                                        <Col span="6">
                                            <p>{{item.appointment | dateTimeFormatter}}</p>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span="6" align="center">
                                            <p>预约医生：</p>
                                        </Col>
                                        <Col span="6">
                                            <p>{{item.doctorName}}</p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>预约护士：</p>
                                        </Col>
                                        <Col span="6">
                                            <p>{{item.nurseName}}</p>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <!--<Col span="6" align="center">-->
                                            <!--<p>提醒方式：</p>-->
                                        <!--</Col>-->
                                        <!--<Col span="6">-->
                                            <!--<p style="text-align: left">{{item.remind | remindFilter}}</p>-->
                                        <!--</Col>-->
                                        <Col span="6" align="center">
                                            <p>预约专家：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left">{{item.expertName | valueFilter}}</p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>处理方式：</p>
                                        </Col>
                                        <Col span="6">
                                            <p v-if="item.process === 1" style="text-align: left"><Tag color="blue">{{item.process | processFilter}}</Tag></p>
                                            <p v-if="item.process === 2" style="text-align: left"><Tag color="#ed3f14">{{item.process | processFilter}}</Tag></p>
                                        </Col>
                                    </Row>
                                    <Row style="margin-top: 5px">
                                        <Col span="6" align="center">
                                            <p>主管医生：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left">{{item.competentDoctor | valueFilter}}</p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>主管护士：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left">{{item.competentNurse | valueFilter}}</p>
                                        </Col>
                                    </Row>
                                    <Row style="margin-top: 5px">
                                        <Col span="6" align="center">
                                            <p>主管客服：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left">{{item.customerName | valueFilter}}</p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>联系方式：</p>
                                        </Col>
                                        <Col span="6">
                                            <p style="text-align: left"><Tag type="border" color="green">{{item.phone | valueFilter}}</Tag></p>
                                        </Col>
                                    </Row>
                                    <Row style="margin-top: 5px">
                                        <Col span="6" align="center">
                                            <p>医生完成状态：</p>
                                        </Col>
                                        <Col span="6">
                                            <p v-if="item.doctorStatus === 0"><Tag color="#ff9900">{{item.doctorStatus | stateFilter}}</Tag></p>
                                            <p v-if="item.doctorStatus === 1"><Tag color="#ed3f14">{{item.doctorStatus | stateFilter}}</Tag></p>
                                            <p v-if="item.doctorStatus === 2"><Tag color="#19be6b">{{item.doctorStatus | stateFilter}}</Tag></p>
                                        </Col>
                                        <Col span="6" align="center">
                                            <p>护士完成状态：</p>
                                        </Col>
                                        <Col span="6">
                                            <p v-if="item.nurseStatus === 0"><Tag color="#ff9900">{{item.nurseStatus | stateFilter}}</Tag></p>
                                            <p v-if="item.nurseStatus === 1"><Tag color="#ed3f14">{{item.nurseStatus | stateFilter}}</Tag></p>
                                            <p v-if="item.nurseStatus === 2"><Tag color="#19be6b">{{item.nurseStatus | stateFilter}}</Tag></p>
                                        </Col>
                                    </Row>
                                    <Row style="margin-top: 5px">
                                        <Col span="6" align="center">
                                            <p>客服完成状态：</p>
                                        </Col>
                                        <Col span="6">
                                            <p v-if="item.customerStatus === 0"><Tag color="#ff9900">{{item.customerStatus | stateFilter}}</Tag></p>
                                            <p v-if="item.customerStatus === 1"><Tag color="#ed3f14">{{item.customerStatus | stateFilter}}</Tag></p>
                                            <p v-if="item.customerStatus === 2"><Tag color="#19be6b">{{item.customerStatus | stateFilter}}</Tag></p>
                                        </Col>
                                    </Row>
                                    <Row style="margin-top: 5px">
                                        <Col span="6" align="center">
                                            <p>预约备注：</p>
                                        </Col>
                                        <Col span="18">
                                            <p style="height: 50px">{{item.note | noteFilter}}</p>
                                        </Col>
                                    </Row>
                                    <!--</TabPane>-->
                                    <!--</Tabs>-->
                                    <p style="margin-top: 10px" align="right">
                                        <ButtonGroup shape="circle">
                                            <Button type="ghost" v-for="(button,index) in buttons2" v-if="button.parentId === menuId2" :key="index" :icon="button.icon" @click="events(button, item)">
                                                {{button.title}}
                                            </Button>
                                        </ButtonGroup>
                                    </p>
                                </Card>
                            </Col>
                        </Row>
                    </Form>
                </Card>
                <Card :bordered="false" :dis-hover="true">
                    <p slot="title">&nbsp;</p>
                    <iview-page
                            :totalSize="pageModel.totalSize"
                            :pageNumber="pageModel.pageNumber"
                            :pageSize="pageModel.pageSize"
                            :pageSizeOpts="pageModel.pageSizeOpts"
                            v-on="{changePageNumber:changePageNumber,changePageSize:changePageSize}">
                    </iview-page>
                </Card>
            </TabPane>
        </Tabs>
    </Card>
</template>

<script>
    import iviewButton from '@/view/common/button/Button.vue';
    import iviewPage from '@/view/common/page/Page.vue';
    export default {
        name: 'text-editor',
        components: {
            iviewButton,
            iviewPage
        },
        data () {
            return {
                menuId1: 2005,
                menuId2: 2000,
                baseURL: '/user/reservation',
                selectRows: [],
                selectRow: {},
                datas: [],
                buttons1: [],
                buttons2: [],
                selectPane: '1',
                pageModel: {
                    totalSize: 0,
                    pageNumber: 1,
                    pageSize: 10,
                    pageSizeOpts: [10, 50, 100]
                }
            };
        },
        filters: {
            statusFilter (value) {
                let temp = ''
                if (value === 0) {
                    temp = '已预约'
                } else if (value === 1) {
                    temp = '已回访'
                } else if (value === 2) {
                    temp = '已到场'
                } else if (value === 3) {
                    temp = '已接诊'
                }
                return temp
            },
            stateFilter (value) {
                let temp = ''
                if (value === 0) {
                    temp = '未完成'
                } else if (value === 1) {
                    temp = '治疗中'
                } else if (value === 2) {
                    temp = '已完成'
                }
                return temp
            },
            typeFilter (value) {
                let temp = ''
                if (value === 1) {
                    temp = '复诊'
                } else if (value === 2) {
                    temp = '新诊'
                }
                return temp
            },
            remindFilter (value) {
                let temp = ''
                if (value === 1) {
                    temp = '短信'
                } else if (value === 2) {
                    temp = '微信'
                } else if (value === 3) {
                    temp = '电话'
                }
                return temp
            },
            processFilter (value) {
                let temp = ''
                if (value === 1) {
                    temp = '电话随访'
                } else if (value === 2) {
                    temp = '预约到店'
                }
                return temp
            },
            valueFilter (value) {
                let temp = value
                if (!temp || temp === null || temp ==='NULL' || temp === '') {
                    return '无'
                }
                return temp
            },
            noteFilter (value) {
                let temp = value
                if (temp === '') {
                    temp = '未填写'
                }
                return temp
            }
        },
        methods: {
            events (item, row) {
                let path = item.path
                if (path === 'confirm') {
                    this.confirm(row)
                } else if (path === 'reAppointment') {
                    this.reAppointment(row)
                } else if (path === 'cancel') {
                    this.cancel(row.id)
                } else if (path === 'arrive') {
                    this.arrive(row)
                } else if (path === 'admission') {
                    this.admission(row)
                } else if (path === 'toll') {
                    this.toll(row)
                } else if (path === 'execute') {
                    this.execute(row)
                } else if (path === 'treatComplete') {
                    this.treatComplete(row)
                } else if (path === 'visitComplete') {
                    this.visitComplete(row)
                } else if (path === 'complete') {
                    this.complete(row)
                } else if (path === 'reAppointment') {
                    this.reAppointment(row)
                }
            },
            clickTabs (name) {
                this.pageModel.pageNumber = 1
                this.pageModel.pageSize = 10
                this.selectPane = name
                this.refresh()
            },
            refresh () {
                this.search()
            },
            search () {
                let url = this.baseURL + '/undone'
                this.$ajax.post(url, {
                    process: this.selectPane,
                    queryModel: {
                        pageNumber: this.pageModel.pageNumber,
                        pageSize: this.pageModel.pageSize
                    }
                }).then((response) => {
                    let {code, data, params, msg} = response.data
                    if (code === 0) {
                        this.datas = data
                        this.pageModel.pageNumber = params.pageNumber
                        this.pageModel.pageSize = params.pageSize
                        this.pageModel.totalSize = params.totalSize
                        this.$emit('getData4', data.length)
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            init () {
                // 加载按钮组
                this.loadButton()
            },
            loadButton () {
                this.$ajax.get('/user/buttons/' + this.menuId1).then((response) => {
                    let {code, data, msg} = response.data
                    if (code === 0) {
                        this.buttons1 = data
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
                this.$ajax.get('/user/buttons/' + this.menuId2).then((response) => {
                    let {code, data, msg} = response.data
                    if (code === 0) {
                        this.buttons2 = data
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            confirm (row) {
                let url = this.baseURL + '/visitConfirm/' + row.id
                this.$ajax.post(url).then(response => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        this.$bus.alert('error', '已回访')
                        this.search()
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            reAppointment (row) {
                let url = this.baseURL + '/checkChange/' + row.id
                this.$ajax.get(url).then(response => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        this.$bus.toPath('/reservation/details', row)
                    } else {
                        this.$bus.alert('warning', msg)
                    }
                })
            },
            cancel (id) {
                let url = this.baseURL + '/checkCancel/' + id
                this.$ajax.get(url).then((response) => {
                    let {code, data, msg} = response.data
                    if (code === 0) {
                        if (data) {
                            this.$Modal.confirm({
                                title: '操作提示',
                                content: '<p>确认取消预约?</p>',
                                onOk: () => {
                                    this.doCancel(id)
                                }
                            })
                        } else {
                            this.$bus.alert('warning', '该记录不符合条件')
                        }
                    } else {
                        this.$bus.alert('error', msg)
                    }
                });
            },
            doCancel (id) {
                let url = this.baseURL + '/cancel/' + id
                this.$ajax.post(url).then((response) => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        this.$bus.alert('success', '取消成功')
                        this.search()
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            arrive (row) {
                let id = row.id
                let url = this.baseURL + '/checkArrived/' + id
                this.$ajax.get(url).then((response) => {
                    let {code, data, msg} = response.data
                    if (code === 0) {
                        if (data) {
                            // 新诊到场要做信息确认
                            if (row.type === 2) {
                                this.selectRow = row
                                // 查询患者信息
                                let url = this.patientURL + '/findById/' + row.patientId
                                this.$ajax.get(url).then(response => {
                                    let {code, data, msg} = response.data
                                    if (code === 0) {
                                        this.patient = data
                                        this.patient.sex = data.sex + ''
                                        this.showConfirm = true
                                    } else {
                                        this.$bus.alert('error', '查询患者信息异常')
                                    }
                                })
                            } else {
                                this.doArrive(id)
                            }
                        } else {
                            this.$bus.alert('warning', '该记录不符合条件')
                        }
                    } else {
                        this.$bus.alert('error', msg)
                    }
                });
            },
            // confirm () {
            //     let url = this.patientURL + '/confirm'
            //     this.$ajax.post(url, this.patient).then(response => {
            //         let {code, msg} = response.data
            //         if (code === 0) {
            //             this.doArrive(this.selectRow.id);
            //         } else {
            //             this.$bus.alert('error', msg)
            //         }
            //     })
            // },
            doArrive (id) {
                let url = this.baseURL + '/arrived/' + id
                this.$ajax.post(url).then((response) => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        this.$bus.alert('success', '已到场')
                        this.showConfirm = false
                        this.search()
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            admission (row) {
                let url = this.baseURL + '/checkAdmission/' + row.id
                this.$ajax.get(url).then(response => {
                    let {code, data, msg} = response.data
                    if (code === 0) {
                        if (data) {
                            this.doAdmission(row)
                        } else {
                            this.$bus.alert('warning', '该记录不符合条件')
                        }
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            doAdmission (row) {
                let url = this.baseURL + '/admission/' + row.id
                this.$ajax.post(url).then(response => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        let query = {
                            id: row.patientId
                        }
                        this.$store.state.app.patientId = row.patientId
                        this.$bus.toPath('/medical', query)
                    } else {
                        this.$bus.alert('error', msg)
                    }
                })
            },
            toll (row) {
                let query = {
                    row: row
                }
                this.$bus.toPath('/center', query)
            },
            execute (row) {
                this.$store.state.app.execute = true
                this.$store.state.app.patientId = row.patientId
                this.$store.state.app.patientName = row.patientName
                this.$store.state.app.medicalNumber = row.medicalNumber
                this.$bus.toPath('/medical/execute')
            },
            treatComplete (row) {
                let url = this.baseURL + '/treatComplete/' + row.id
                this.$ajax.post(url).then((response) => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        setTimeout(() => {
                            this.$Modal.confirm({
                                title: '操作提示',
                                content: '<p>操作成功，是否进行下一次预约</p>',
                                onOk: () => {
                                    row.complete = true
                                    this.$bus.toPath('/reservation/details', row)
                                },
                                onCancel: () => {
                                    this.refresh()
                                }
                            })
                        }, 100)
                    } else {
                        this.$bus.alert('error', msg)
                    }
                });
            },
            visitComplete (row) {
                let url = this.baseURL + '/visitComplete/' + row.id
                this.$ajax.post(url).then((response) => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        this.$bus.alert('success', '操作成功')
                        this.refresh()
                    } else {
                        this.$bus.alert('error', msg)
                    }
                });
            },
            complete (row) {
                let url = this.baseURL + '/checkComplete/' + row.id
                this.$ajax.get(url).then((response) => {
                    let {code, data, msg} = response.data
                    if (code === 0) {
                        if (data) {
                            this.doComplete(row)
                        } else {
                            this.$bus.alert('warning', '该记录不符合条件')
                        }
                    } else {
                        this.$bus.alert('error', msg)
                    }
                });
            },
            doComplete (row) {
                let url = this.baseURL + '/complete/' + row.id
                this.$ajax.post(url).then((response) => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        setTimeout(() => {
                            this.$Modal.confirm({
                                title: '操作提示',
                                content: '<p>操作成功，是否进行下一次预约</p>',
                                onOk: () => {
                                    row.complete = true
                                    this.$bus.toPath('/reservation/details', row)
                                },
                                onCancel: () => {
                                    this.refresh()
                                }
                            })
                        }, 100)
                    } else {
                        this.$bus.alert('error', msg)
                    }
                });
            },
            reAppointment (row) {
                let url = this.baseURL + '/checkChange/' + row.id
                this.$ajax.get(url).then(response => {
                    let {code, msg} = response.data
                    if (code === 0) {
                        this.$bus.toPath('/reservation/details', row)
                    } else {
                        this.$bus.alert('warning', msg)
                    }
                })
            },
            changeSelect (rows) {
                this.selectRows = rows
            },
            changeTotalSize (totalSize) {
                this.pageModel.totalSize = totalSize
            },
            changePageNumber (pageNumber) {
                this.pageModel.pageNumber = pageNumber
                this.refresh()
            },
            changePageSize (pageSize) {
                this.pageModel.pageSize = pageSize
                this.refresh()
            }
        },
        mounted () {
            this.init()
        }
    }
</script>

<style>
</style>
